Topic:

Graphics for Web Documents

General Tips

Graphics supply some of the most spectacular elements in Web documents. Graphics have many uses, ranging from from logo displays, product images, color bars, buttons and more. Although graphics can add significant value to Web documents, they also can be detrimental if they're not used wisely.

Most people continue to use 14.4 modems for Internet access, which means that they must wait for every page to load. If your pages take too long to load, most people will go somewhere else. Therefore, when you're using graphics in your Web pages, please keep the following in mind:

• Restrict the color depth to 256 colors or less.
• Whenever possible, keep the total size of any single document and its graphics below 50K.
• Keep button, ball, and colored bar usage to a minimum. Also, re-use graphical objects throughout your site. Once a graphic is loaded, most browsers will store the object in a cache for instant access when another page calls for it.
• When using a background image, keep it small, keep the color depth as low as possible, and create a sharp but readable contrast between the text color and the background image.
• Use graphics sparingly. Graphics should be used to catch the eye and highlight your content.
• Always provide ALT= strings in your IMG tags. Not everyone can display graphics and many people surf with graphics turned off; in both cases, they won't see your graphics at all, no matter how compelling or attractive.

URLs:

A searchable GIF archive

A search engine that searches a large GIF archive by description. These tools tend to be finicky, so try to use search terms that might appear in a path name or general descriptions like button or bar.

Sandra's clip-art server

This is the most comprehensive archive of images and links to graphic collections on the Internet.

Images, Icons and Flags

This is a good collection of NASA, earth, travel, medical, icon and flag archives. Start here to jump to over a hundred graphic archive sites all over the globe.

Lots more Icons

A Yahoo link list of icon archives. This is a great starting point to look for buttons and small images to add spice to your Web documents.

The KPT backgrounds archive

Kai's Power Tools is a collection of add-ons and plug-ins for Adobe Photoshop, and includes tips and tricks for image creation, as well as an archive of images.

Netscape's background sampler

A collection of seamless background images.

Image Finder

A search tool for finding images in the wuarchive.wustl.edu graphics archive. This search engine uses filename, description, or category to look for images.

Aaron's Graphic Archive

An image collection of 3D, architecture, art, cars, fractals and more.

Greg's GIF/JPEG Collection

A long long long list of images divided into categories.

W3E References:

GIF

Transparent GIF

JPG